<!--
*  功能描述：项目综合统计
 -->
 <template>
  <div>
    <el-tag style="width: 100%; text-align: left; font-size: 20px"
      >查询项目综合统计</el-tag
    >
    <el-form>
        <el-form-item label="生产部门" prop="DName">
        
      <el-select v-model="DName" placeholder="请选择" clearable> 
        <el-option
          v-for="item in Depart"
          :key="item.DepId"
          :value="item.DepName"
          :label="item.DepName"
          ></el-option
        ></el-select
      >
      <el-button type="primary" @click="onsubmit">查询</el-button>
      </el-form-item>
      </el-form>
      <el-tag style="width: 100%; text-align: left; font-size: 20px"
      >自定义查询条件</el-tag>
      <el-col :span="24">
        <el-checkbox v-model="cuid">项目总数</el-checkbox>
        <el-checkbox v-model="cuname">项目规模</el-checkbox>
        <el-checkbox v-model="cuphone">立项通过数</el-checkbox>
        <el-checkbox v-model="jx">进行中项目</el-checkbox>
        <el-checkbox v-model="zt">暂停项目</el-checkbox>
        <el-checkbox v-model="wc">完成项目</el-checkbox>
      </el-col>
      <el-col :span="24">
        <el-form :inline="true" class="demo-form-inline">
          <v-show v-if="cuid">
            <el-form-item label="项目总数">
              <el-input v-model="Conid" clearable placeholder="项目总数"></el-input>
            </el-form-item>
          </v-show>
          <v-show v-if="cuname">
            <el-form-item label="项目规模">
              <el-input v-model="Scaleid" clearable placeholder="项目规模"></el-input>
            </el-form-item>
          </v-show>

          <v-show v-if="cuphone">
            <el-form-item label="立项通过数">
              <el-input v-model="Lxid" clearable placeholder="立项通过数"></el-input>
            </el-form-item>
          </v-show>
          <v-show v-if="jx">
            <el-form-item label="进行中项目">
              <el-input v-model="Jxid" clearable placeholder="进行中项目"></el-input>
            </el-form-item>
          </v-show>
          <v-show v-if="zt">
            <el-form-item label="暂停项目">
              <el-input v-model="Ztid" clearable placeholder="暂停项目"></el-input>
            </el-form-item>
          </v-show>
          <v-show v-if="wc">
            <el-form-item label="完成项目">
              <el-input v-model="Wcid" clearable placeholder="完成项目"></el-input>
            </el-form-item>
          </v-show>
          <el-form-item>
            <el-button type="primary" @click="cha">查询</el-button>
            
          </el-form-item>
        </el-form>
      </el-col>


      <el-tag style="width: 100%; text-align: left; font-size: 20px"
      >项目综合统计列表</el-tag
    >
    <div >
      <el-table :data="tabledata" border style="width: 100%">
        <el-table-column prop="DName" label="生产部门" >
        </el-table-column>
        <el-table-column prop="Conid" label="项目总数" >
        </el-table-column>
        <el-table-column prop="Scaleid" label="项目规模(㎡)" >
        </el-table-column>
        <el-table-column prop="Lxid" label="立项通过数" >
        </el-table-column>
        <el-table-column prop="Jxid" label="进行中项目" >
        </el-table-column>
        <el-table-column prop="Ztid" label="暂停项目" >
        </el-table-column>
        <el-table-column prop="Wcid" label="完成项目" >
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      Depart:[],
        cuid: false,
      cuname: false,
      cuphone: false,
      jx:false,
      zt: false,
      wc: false,
      tabledata: [],
      Conid:'',
        Scaleid:null,
        Lxid:null,
        Jxid:null,
        Ztid:null,
        Wcid:null,
        DName:"",
    };
  },
  methods: {
    onsubmit(){
      this.ShowCountPro();
    },
      cha(){
          this.ShowCountPro();
      },
    ShowCountPro() {
      this.$http({
        url: "LeadingCockpit/GetProject",
        method: "Get",
        params: {
          Conid:this.Conid,
          Scaleid: this.Scaleid,
          Lxid:this.Lxid,
          Jxid:this.Jxid,
          Ztid:this.Ztid,
          Wcid:this.Wcid,
          DName:this.DName,
        }
      }).then((res) => {
        this.tabledata = res.data;
        console.log(res.data);
      });
    },
    DeptXl() {
      this.$http({
        url: "LeadingCockpit/GetDept",
        method: "Get",
      }).then((res) => {
        this.Depart = res.data;
        console.log(this.data);
      });
    },
  },
  created() {
    this.ShowCountPro();
    this.cha();
    this.onsubmit();
    this.DeptXl();
  },
};
</script>